<template>
	<view class="navbox" :style="{height:`${obj.wh.navHeight}px`}">
		<view class="status" :style="{height:`${obj.wh.statusBarHeight}px`}"></view>
		<view class="navigation" :style="{height:`${obj.wh.navigationBarHeight}px`,width:`${obj.wh.custom.left}px`}">
			<view class="spot flex-center" v-if="obj.isnews"></view>
			<image class="logo" src="../../static/40.png" mode="aspectFill" @click="$c.go_url('/pages/center')"></image>
			<view class="title">
				<text>麦丝儿</text>
				<!-- <image style="width: 160rpx;" src="../../static/26.png" mode="widthFix"></image> -->
			</view>
			<!-- <text style="opacity: 0;" @click="$c.go_url('/pages/index/indexold')">t</text> -->
		</view>
	</view>
</template>

<script setup>
    import { reactive, getCurrentInstance,onMounted,onUnmounted } from 'vue'
	import { onLoad,onShow,onUnload,onTabItemTap,onReachBottom,onPullDownRefresh,onPageScroll,onHide } from '@dcloudio/uni-app';
    let { proxy } = getCurrentInstance()
	
	let obj = reactive({
		wh: proxy.$c.getglobal(),
		Interval: null,
		isnews: false
	})
	
	onShow(()=>{
		initInterval()
	})
	
	onHide(()=>{
		console.log(1111);
		clearInterval(obj.Interval)
		obj.Interval = null
	})
	
	onUnmounted(()=>{
		clearInterval(obj.Interval)
		obj.Interval = null
	})
	
	const initInterval=()=>{
		if(obj.Interval){
			clearInterval(obj.Interval)
			obj.Interval = null
		}
		getnews()
		obj.Interval = setInterval(()=>{
			getnews()
		},2000)
	}
	
	const getnews=()=>{
		proxy.$reQuest.post('mp/product/inquiry/room',obj.req,{token: true,noOut:true},).then(d=>{
			if(d.success){
				let isnews = false
				for (let i = 0; i < d.msg.list.length; i++) {
					const e = d.msg.list[i]
					if(e.cou&&!isnews){
						isnews = true
					}
				}
				obj.isnews = isnews
			}else{obj.isnews = false}
		}).catch(err=>{obj.isnews = false})
	}
</script>

<style lang="scss" scoped>
	.navbox{
		position: fixed;left: 0;top: 0;z-index: 999999;width: 100vw;
		background: linear-gradient( 180deg, #BCE5F7 0%, #D5ECF8 100%);
		.status{width: 100vw;}
		.navigation{
			width: 100vw;position: relative;
			padding: 0 30rpx;box-sizing: border-box;
			display: flex;flex-direction: row;align-items: center;
			.spot{position: absolute;left: 70rpx;top: 15rpx;z-index: 1;width: 14rpx;height: 14rpx;border-radius: 50%;background-color: red;color: #fff;font-size: 22rpx;}
			.logo{width: 60rpx;height: 60rpx;}
			.title{
				flex: 1;text-align: center;
				font-size: 32rpx;font-weight: bold;
			}
		}
	}
</style>